import {createRouter,createWebHashHistory} from "vue-router";

// import About from "@/views/About.vue";
// import Home from "@/views/Home.vue";
const Home  =()=> import('../views/Home.vue')
const About =()=> import('../views/About.vue')
const Index =()=> import('../views/user-center/index.vue')
const Profile =()=> import('../views/user-center/Profile.vue')
const Settings =()=> import('../views/user-center/Settings.vue')
const VuexPage =()=> import('../views/Vuex.vue')
const ElementTest =()=> import('../views/ElementTest.vue')
const ListDemo =()=>import('../views/ListDemo.vue')
const ListDemo2 =()=>import('../views/ListDemo2.vue')
const Zhs =()=>import('../views/composition-api/Index.vue')
const Register =()=>import('../views/Register.vue')
const AccountList =()=>import('../views/AccountList.vue')


//404
const NotFound =()=> import('../views/404.vue')
const Product =()=> import('../views/Product.vue')
const routes =[
    {
        path:'/',
        redirect:'/home',
    },
    {
        path:'/home',
        name:'home',
        component:Home
    },
    {
        path:'/elementTest',
        name:'饿了么ui',
        component:ElementTest
    },
    {
        path:'/listdemo',
        name:'翻页',
        component:ListDemo
    },
    {
        path:'/listdemo2',
        name:'翻页2',
        component:ListDemo2
    },
    {
        path:'/zhs',
        name:'组合式api',
        component:Zhs
    },
    {
        path:'/register',
        name:'register',
        component:Register
    },
    {
        path:'/accountList',
        name:'accountList',
        component:AccountList
    },
    {
        path:'/product/:id',
        name:'product',
        component:Product
    },
    {
        path:'/about',
        name:'about',
        component:About
    },
    {
        path:'/user',
        name:'user',
        component:Index,
        redirect:'/user/profile',
        children:[
            {
            path:'profile',
            name:'profile',
            component:Profile
            },
            {
            path:'settings',
            name:'settings',
            component:Settings
            }
        ]
    },
    {
        path:'/:pathMatch(.*)*',
        name:'NotFound',
        component:NotFound
    },

    {
        path:"/vuex",
        name:'vuex',
        component:VuexPage
    }

]

const router = createRouter({
    history: createWebHashHistory(),
    routes,
})

export default router